<template>
  <div>
    <van-nav-bar :title="$route.query.key+'的结果'" left-arrow @click-left="$router.back()" />
<van-list
  v-model="loading"
  :finished="finished"
  finished-text="没有更多了"
  @load="onLoad"
>
  <van-cell v-for="item in list" :key="item.art_id" :title="item.title" @click="$router.push({ name: 'article', query: { id: item.art_id } })"/>
</van-list>
  </div>
</template>

<script>
// 导入搜索结果
import {searchListAPI} from '@/api'
export default {
  data() {
    return {
      list: [],
      loading: false,
      finished: false,
        key: this.$route.query.key,
        page:1
    };
  },
  methods: {
  async  onLoad() {
      
    // 发起请求
    let res=await searchListAPI({
         page:this.page, 
         per_page:10,
         q:this.key
    })
    this.list.push(...res.data.data.results)
    this.page++
      // 代表本次加载完毕
      this.loading = false;
    if(this.list.length ==res.data.data.length ){
        this.finished=true
    }
    // console.log(this.list.title);
    },
  }, 
};
</script>

<style>

</style>